let xmlhttp;
if (window.XMLHttpRequest) {
    xmlhttp = new XMLHttpRequest;
} else {
    xmlhttp = new ActiveXObject("Microsofet.XMLHTTP");
}

function query() {
    let tbody = document.getElementById('tbody');
    let html = "";
    xmlhttp.onreadystatechange = () => {
        if (xmlhttp.readyState === 4 && xmlhttp.status === 200) {
            var person = JSON.parse(xmlhttp.responseText);
            // console.log(person);
            for (let i = 0; i < person.length; i++) {
                html += `<tr>
                   <td>${person[i].uid}</td>
                   <td>${person[i].uname}</td>
                   <td>${person[i].upwd}</td>
                   <td>${person[i].email}</td>
                   <td>${person[i].phone}</td>
                   <td>${person[i].avatar}</td>
                   <td>${person[i].user_name}</td>
                   <td>${person[i].gender}</td>
                   <td><a href="javascript:dele(${person[i].uid})">删除</a></td>
                   <td><a href="javascript:updateTable(${person[i].uid})">修改</a></td>
                   <td><a href="/user.html?uid=${person[i].uid}">个人主页</a></td>
                   <td><a href="/upImg.html?uid=${person[i].uid}">上传头像</a></td>
                   </tr>`;
            }
            //    console.log(html);
            tbody.innerHTML = html;
        }
    }
    xmlhttp.open('GET', "http://127.0.0.1:8080/v1/users/list2", true);
    xmlhttp.send();
}
// 删除指定用户
function dele(uid) {
    let q = confirm("是否删除" + uid);
    if (!q) {
        return;
    }
    xmlhttp.onreadystatechange = () => {
        if (xmlhttp.readyState === 4 && xmlhttp.status === 200) {
            let msg = JSON.parse(xmlhttp.responseText).code;
            // console.log('msg: ', msg);
            if (msg == 200) {
                query();
                alert("删除用户" + uid + '成功！');
            } else {
                alert("删除用户" + uid + '失败！');
            }

        }
    }
    let url = "http://127.0.0.1:8080/v1/users/delete" + uid;
    console.log('url: ', url);
    xmlhttp.open('DELETE', url, true);
    xmlhttp.send();
}

function updateTable(uid) {
    let html = '';
    let url = "http://127.0.0.1:8080/v1/users/fuser" + uid;
    let upform = document.getElementById('upu');
    xmlhttp.onreadystatechange = () => {
        if (xmlhttp.readyState === 4 && xmlhttp.status === 200) {
            let person = JSON.parse(xmlhttp.responseText)[0];
            console.log(' person: ', person);
            html = `<form>
   <fieldset>
    <legend>
    <h3>修改用户${uid}的信息 </h3>
        用户名：
        <input id="uname" name="uname" type="text" class="form-control"  value="${person.uname}"><br>
        密码：
        <input id="upwd" name="upwd" type="text" class="form-control" value="${person.upwd}"><br>
        邮箱：
        <input  id="email" name="email" type="text" class="form-control" value="${person.email}"><br>
        电话：
        <input id="phone" name="phone" type="text" class="form-control" value="${person.phone}"><br>
        头像：
        <input id="avatar" name="avatar" type="text" class="form-control" value="${person.avatar}"><br>
        姓名：
        <input id="user_name" name="user_name" type="text" class="form-control" value="${person.user_name}"><br>
        性别
        <input id="gender" name="gender" type="text" class="form-control" value="${person.gender}"><br>
        <input type="button" class="btn btn-primary" value="修改" onclick="updateUser(${uid})"><br>
        <h3>提示信息</h3>
        <h3 id="upmsg" style="color:red"></h3>
    </legend>
</fieldset>
</form> `;
            upform.innerHTML = html;
        }
    }

    xmlhttp.open('GET', url, true);
    xmlhttp.send();
}

function updateUser(uid) {
    let formdata;
    let upmsg=document.getElementById('upmsg');
    let uname = document.getElementById('uname').value;
    let upwd = document.getElementById('upwd').value;
    let email = document.getElementById('email').value;
    let phone = document.getElementById('phone').value;
    let avatar = document.getElementById('avatar').value;
    let user_name = document.getElementById('user_name').value;
    let gender = document.getElementById('gender').value;
    xmlhttp.onreadystatechange = () => {
        if (xmlhttp.readyState === 4 && xmlhttp.status === 200) {
            let person = JSON.parse(xmlhttp.responseText);
            if(person.code===200){
                query();
            }
            upmsg.innerHTML=person.msg;
        }
    }
    let url = "http://127.0.0.1:8080/v1/users/update" + uid;
    xmlhttp.open('PUT', url, true);
    xmlhttp.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
    formdata =
        `uname=${uname}&upwd=${upwd}&email=${email}&phone=${phone}&avatar=${avatar}&user_name=${user_name}&gender=${gender}`;
        if(!confirm(`是否要修改用户${uid}的信息？`)){
            return;
        }
    xmlhttp.send(formdata);
}